<!DOCTYPE HTML>
<html lang="cn" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <%include("/common/header.html",{title:''}){}%>
    <title>志愿者招募管理</title>
</head>
<body>


<div class="x-nav" style="margin-top: 30px;margin-left: 30px">
      <span class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
        <a href="javascript:;">首页</a><span lay-separator="">/</span>
        <a href="javascript:;">会员管理</a><span lay-separator="">/</span>
        <a><cite>志愿者招募管理</cite></a>
      </span>
    <a class="layui-btn layui-btn-primary layui-btn-small" style="margin-top:4px;float:right;" href="javascript:location.replace(location.href)"; title="刷新">
        <i class="layui-icon layui-icon-refresh-3"></i>
    </a>
</div>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <table id="LAY-user-manage" lay-filter="LAY-user-manage"></table>
            <script type="text/html" id="toolbarDemo">
                <button class="layui-btn layuiadmin-btn-useradmin">志愿者信息</button>
            </script>
            <script type="text/html" id="table-useradmin-webuser">
                {{#  if(d.code==2){ }}
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
                <a id="agree" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="agree"><i class="layui-icon layui-icon-edit"></i>同意申请</a>
                <a id="refuse" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="refuse"><i class="layui-icon layui-icon-edit"></i>拒绝申请</a>
                {{#  }else if( d.code==0){ }}
                <a style="margin-left: 25px;" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="view"><i class="layui-icon layui-icon-edit"></i>查看</a>
                <a id="agreed" class="layui-btn layui-btn-normal layui-btn-xs" style="background-color: gray;margin-left: 50px;" lay-event=""><i class="layui-icon layui-icon-edit"></i>已同意</a>
                {{#  }else if( d.code==1){ }}
                <a style="margin-left: 12px;" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="reason1"><i class="layui-icon layui-icon-edit"></i>拒绝原因</a>
                <a id="refused" class="layui-btn layui-btn-normal layui-btn-xs" style="background-color: gray;margin-left: 10px;" lay-event=""><i class="layui-icon layui-icon-edit"></i>已拒绝</a>
                {{#  } }}
            </script>
        </div>
    </div>
</div>

<!-- 弹出查看页面 -->
<div class="layui-form" lay-filter="layuiadmin-form-useradmin"
     id="layuiadmin-form-useradmin1"
     style="padding: 15px;display: none">
    <form action class="layui-form" lay-filter="component-form-element1" id="myform1">
        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">姓名:</label>
            <div class="layui-input-inline">
                <input type="text" id="name1" name="name" disabled class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">性别:</label>
            <div class="layui-input-inline">
                <input type="text" id="sex1" name="sex" disabled class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">手机号码:</label>
            <div class="layui-input-inline">
                <input disabled style="float:left;width: 140px;" type="text" id="phone1" name="phone" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">微信号:</label>
            <div class="layui-input-inline">
                <input disabled style="float:left;width: 140px;" type="text" id="weChat1" name="weChat" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">高校:</label>
            <div class="layui-input-inline">
                <input disabled style="float:left;width: 140px;" type="text" id="school1" name="school" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">服务频次:</label>
            <div class="layui-input-inline">
                <input disabled style="float:left;width: 140px;" type="text" id="times1" name="times" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">技能:</label>
            <div class="layui-input-inline" style="width: 555px">
                <textarea disabled class="layui-textarea" type="text" id="good_at1" name="good_at" ></textarea>
            </div>
        </div>

    </form>
</div>

<!-- 弹出修改页面 -->
<div class="layui-form" lay-filter="layuiadmin-form-useradmin"
     id="layuiadmin-form-useradmin"
     style="padding: 15px;display: none">
    <form action class="layui-form" lay-filter="component-form-element" id="myform">
        <input type="hidden" name="v_id">
        <input type="hidden" name="id">
        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">姓名:</label>
            <div class="layui-input-inline">
                <input type="text" name="name" lay-verify="required" value="" class="layui-input"
                       placeholder="请输入姓名">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">性别:</label>
            <div class="layui-input-inline">
                <input checked type="radio" name="sex" lay-verify="required" value="男" class="layui-radio"
                       placeholder="请选择性别"><span style="position: absolute;left: 27px;top: 10px;">男</span>
                <input type="radio" name="sex" lay-verify="required" value="女" class="layui-radio"
                       placeholder="请选择性别"><span style="position: absolute;left: 80px;top: 10px;">女</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">手机号码:</label>
            <div class="layui-input-inline">
                <input type="text" name="phone" lay-verify="required" value="" class="layui-input"
                       placeholder="请输入手机号码">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">微信号:</label>
            <div class="layui-input-inline">
                <input type="text" name="weChat" lay-verify="required" value="" class="layui-input"
                       placeholder="请输入微信号">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">高校:</label>
            <div class="layui-input-inline">
                <select style="height: 40px;width: 70px" lay-verify="required" name="school">
                    <option value='' disabled selected style='display:none;'>请选择所在高校</option>
                    <option value="沈阳大学" >沈阳大学</option>
                    <option value="沈阳理工大学" >沈阳理工大学</option>
                    <option value="沈阳建筑大学" >沈阳建筑大学</option>
                    <option value="沈阳工业大学" >沈阳工业大学</option>
                    <option value="沈阳药科大学" >沈阳药科大学</option>
                    <option value="中国刑事警察学院" >中国刑事警察学院</option>
                    <option value="辽宁中医药大学" >辽宁中医药大学</option>
                    <option value="沈阳化工大学" >沈阳化工大学</option>
                    <option value="沈阳航空航天大学" >沈阳航空航天大学</option>
                    <option value="沈阳医学院" >沈阳医学院</option>
                    <option value="沈阳师范大学" >沈阳师范大学</option>
                    <option value="沈阳工程学院" >沈阳工程学院</option>
                    <option value="东北大学" >东北大学</option>
                    <option value="辽宁大学" >辽宁大学</option>
                    <option value="中国医科大学" >中国医科大学</option>
                    <option value="沈阳农业大学" >沈阳农业大学</option>
                    <option value="沈阳城市学院" >沈阳城市学院</option>
                    <option value="沈阳城市建设学院" >沈阳城市建设学院</option>
                    <option value="沈阳工业大学工程学院" >沈阳工业大学工程学院</option>
                    <option value="沈阳化工大学科亚学院" >沈阳化工大学科亚学院</option>
                    <option value="辽宁中医药大学杏林学院" >辽宁中医药大学杏林学院</option>
                    <option value="沈阳医学院何氏视觉科学学院" >沈阳医学院何氏视觉科学学院</option>
                    <option value="辽宁省交通高等专科学校" >辽宁省交通高等专科学校</option>
                    <option value="沈阳航空职业技术学院" >沈阳航空职业技术学院</option>
                    <option value="辽宁体育运动职业技术学院" >辽宁体育运动职业技术学院</option>
                    <option value="辽宁生态工程职业学院" >辽宁生态工程职业学院</option>
                    <option value="沈阳职业技术学院" >沈阳职业技术学院</option>
                    <option value="辽宁金融职业学院" >辽宁金融职业学院</option>
                    <option value="辽宁轨道交通职业学院" >辽宁轨道交通职业学院</option>
                    <option value="辽宁广告职业学院" >辽宁广告职业学院</option>
                    <option value="辽宁经济职业技术学院" >辽宁经济职业技术学院</option>
                    <option value="辽宁商贸职业学院" >辽宁商贸职业学院</option>
                    <option value="辽宁装备制造职业技术学院" >辽宁装备制造职业技术学院</option>
                    <option value="辽宁现代服务职业技术学院" >辽宁现代服务职业技术学院</option>
                    <option value="辽宁城市建设职业技术学院" >辽宁城市建设职业技术学院</option>
                    <option value="辽宁医药职业学院" >辽宁医药职业学院</option>
                    <option value="沈阳北软信息职业技术学院" >沈阳北软信息职业技术学院</option>
                    <option value="辽宁政法职业学院" >辽宁政法职业学院</option>
                    <option value="辽宁民族师范高等专科学校" >辽宁民族师范高等专科学校</option>
                    <option value="辽宁特殊教育师范高等专科学校" >辽宁特殊教育师范高等专科学校</option>
                    <option value="辽宁师范高等专科学校" >辽宁师范高等专科学校</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">服务频次:</label>
            <div class="layui-input-inline">
                <input checked type="radio" name="times" lay-verify="required" value="一周一次" class="layui-radio"
                       placeholder="请选择服务频次"><span>一周一次</span></br>
                <input type="radio" name="times" lay-verify="required" value="一周多次" class="layui-radio"
                       placeholder="请选择服务频次"><span>一周多次</span></br>
                <input type="radio" name="times" lay-verify="required" value="半月一次" class="layui-radio"
                       placeholder="请选择服务频次"><span>半月一次</span></br>
                <input type="radio" name="times" lay-verify="required" value="一月一次" class="layui-radio"
                       placeholder="请选择服务频次"><span>一月一次</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" style="padding-left: 0px;font-size: medium;width: auto;">技能:</label>
            <div class="layui-input-inline" style="width: 555px">
                <textarea id="good_at" type="text" style="display: none" name="good_at" lay-verify="content"></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block" style="margin-left: 240px;">
                <button class="layui-btn" lay-submit="" lay-filter="component-form-element">立即提交</button>
            </div>
        </div>
    </form>
</div>

</div>
<%include("/common/foot.html"){}%>
<script>
    layui.config({
        base : 'static/layuiadmin/' //静态资源所在路径
    }).extend({
        index : 'lib/index' //主入口模块
    }).use([ 'index', 'table','form','layedit','laydate'], function() {
        var $ = layui.$;
        var table = layui.table;
        var form = layui.form;
        var title="志愿者招募";
        var size=['600px', '500px'];
        var findAll_url='system/volunteer/findAll.json';
        var agree_url='system/volunteer/agree.json';
        var refuse_url='system/volunteer/refuse.json';
        var update_url='system/volunteer/update.json';
        var index;//定义建立富文本编辑器全局变量
        var layedit//定义富文本编辑器layedit全局变量
        var cols=[ //表头
            {field: 'name',title: '姓名',fixed: 'left'},
            {field: 'sex',title: '性别'},
            {field: 'phone',title: '手机号码'},
            {field: 'weChat',title: '微信号'},
            {field: 'school',title: '高校'},
            {field: 'times',title: '服务频次'},
            {field: 'good_at',title: '技能'},
            {title:'操作', width:270, toolbar: '#table-useradmin-webuser',fixed: 'right'}
        ]

        table.render({
            elem: '#LAY-user-manage',
            id: 'listReload',
            toolbar: '#toolbarDemo',
            title: title,
            url: findAll_url,
            page: true, //开启分页
            limits: [10, 20, 30, 50], //控制多少行一页（默认五条一页）
            defaultToolbar: ['filter', 'print', 'exports'],
            cols: [cols],
            done() {
                //alert() 数据渲染完的方法
            }
        });

        //初始化修改页面

        function loadData(data) {

            var ret = {
                "id": data.id,
                "v_id": data.v_id,
                "name": data.name,
                "phone": data.phone,
                "sex": data.sex,
                "weChat": data.weChat,
                "school": data.school,
                "times": data.times,
                "good_at": data.good_at,
            }
            form.render();
            return ret;
        }

        //编辑
        function initUpdate(data) {
            var a = layer.open({
                type: 1,
                title: title,
                content: $('#layuiadmin-form-useradmin'),
                btn: ['关闭'], //可以无限个按钮
                cancel: function (index, layero) {//取消事件
                    location.replace(location.href);　//layer.open关闭刷新
                },
                success: function (layero, index) {
                    layer.iframeAuto(index);
                }
            });
            layer.full(a);
            //富文本编辑器
            layedit = layui.layedit;
            //建立编辑器
            index = layedit.build('good_at', {
                tool: ['strong', 'italic', 'underline', 'del', '|',
                    'left', 'center', 'right', '|',
                    'link', 'unlink',],
                height: 280
            });

            //富文本表单验证
            form.verify({
                good_at: function (value) {
                    var val = layedit.getText(index);
                    //alert(val.length)
                    if (val.length < 6) {

                        return '内容至少6个字符'
                    }
                }
            });
            //如果是添加则重置表单，如果是编辑则给表单赋值
            if (data == 0 || data == null) {
                $('#myform')[0].reset();
                return;
            } else {
                layui.form.val("component-form-element", loadData(data));
            }
        }

        //弹出查看页面调用初始化数据方法
        function initUpdate1(data) {
            var a = layer.open({
                type: 1,
                title: title,
                content: $('#layuiadmin-form-useradmin1'),
                btn: ['关闭'], //可以无限个按钮
                cancel: function (index, layero) {//取消事件
                    //location.replace(location.href);　//layer.open关闭刷新
                },
                success: function (layero, index) {
                    layer.iframeAuto(index);
                }
            });
            layer.full(a);
            //给表单赋值
            $("#name1").val(data.name);
            $("#sex1").val(data.sex);
            $("#phone1").val(data.phone);
            $("#weChat1").val(data.weChat);
            $("#school1").val(data.school);
            $("#times1").val(data.times);
            var good_at=data.good_at;
            good_at = good_at.replace(/(\n)/g, "");
            good_at = good_at.replace(/(\t)/g, "");
            good_at = good_at.replace(/(\r)/g, "");
            good_at = good_at.replace(/<\/?[^>]*>/g, "");
            good_at = good_at.replace(/\s*/g, "");
            $("#good_at1").val(good_at);
        }

        //修改页面的内容提交到后台处理
        form.on('submit(component-form-element)', function (data) {
            data.field.good_at = layedit.getContent(index);
            postUpdate(data);
            return false;
        });

        //点击每行右工具栏“操作”里面按钮效果
        table.on('tool(LAY-user-manage)', function(obj) {
            var data = obj.data;
            if (obj.event === 'agree') {
                $.ajax({
                    url : agree_url,
                    type : "POST",
                    data : {
                        "id" : data.id,
                    },
                    dataType : "json",
                    success : function(ret) {
                        //alert(ret.code)
                        layer.msg(ret.msg, {icon: 6});

                        setTimeout(function (){

                            window.location.reload();
                        }, 1000);

                    },
                    error:function(jqXHR, textStatus, errorThrown){
                        var estr="Page:"+window.location.pathname+",Function: postDelete()";
                        layer.open({
                            title: "错误信息",
                            area: ['600px', '600px'],
                            type: 2,
                            content: "base/error.jhtml?info="+estr, //
                            btn: ['关闭'] //可以无限个按钮
                        });
                    }
                });
            } else if(obj.event === 'edit'){
                initUpdate(data);
            } else if (obj.event === 'view') {
                initUpdate1(data);
            } else if(obj.event === 'refuse'){
                layer.prompt({title: '请输入驳回原因', formType: 2}, function(text, index){
                    layer.close(index);
                    $.ajax({
                        url : refuse_url,
                        type : "POST",
                        data : {
                            "id" : data.id,
                            "code" : 1,
                            "reason1" : text
                        },
                        dataType : "json",
                        success : function(ret) {
                            layer.msg(ret.msg, {icon: 6});
                            setTimeout(function (){
                                window.location.reload();
                            }, 1000);
                        },
                        error:function(jqXHR, textStatus, errorThrown){
                            var estr="Page:"+window.location.pathname+",Function: postDelete()";
                            layer.open({
                                title: "错误信息",
                                area: ['600px', '600px'],
                                type: 2,
                                content: "base/error.jhtml?info="+estr, //
                                btn: ['关闭'] //可以无限个按钮
                            });
                        }
                    });
                });
            } else if (obj.event === 'reason1') {
                layer.alert(data.reason1)
            }
        });

        //ajax提交修改内容
        window.postUpdate = function (data) {
            var formData = new FormData();
            formData.append("data", JSON.stringify(data.field));
            // formData.append("file", $("input[name='file']")[0].files[0]);
            $.ajax({
                url: update_url,
                type: "POST",
                //traditional:true,
                data: formData,
                processData: false,
                contentType: false,
                success: function (data) {
                    if (data.code == 1) {
                        layer.closeAll();
                        layer.msg(data.msg, {time: 600, icon: 1}, function () {
                            //table.reload('listReload');
                            location.replace(location.href);
                        });
                    } else {
                        layer.msg(data.msg, {icon: 5});
                    }
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    var estr = "Page:" + window.location.pathname + ",Function:postUpdate()";
                    layer.open({
                        title: "错误信息",
                        type: 2,
                        content: "base/error.jhtml?info=" + estr,
                        btn: ['关闭'] //可以无限个按钮
                    });
                }
            });
        }

    });

</script>
</body>

</html>
